<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<%@ page language="java" contentType="text/html; charset=utf-8"
         pageEncoding="utf-8" %>
<html>
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <%--<link rel="icon" href="images/min-logo.ico" type="images/x-ico"/>--%>
    <!-- 运用bookstrap时需要引入 -->
    <meta http-equiv="x-ua-compatible" content="IE=edge">
    <link href="css/bootstrap.min.css" rel="stylesheet">
    <title>购物车</title>

    <!-- 当页面需要jquery才引入 -->
    <script src="js/jquery.min.js"></script>
    <script src="js/bootstrap.js"></script>

    <%--    <script src="./js/car.js"></script>--%>

    <%--<link rel="stylesheet" href="css/reset.css">
    <link rel="stylesheet" href="css/car.css">--%>
    <link rel="stylesheet icon" type="text/css" href="${pageContext.request.contextPath}/admin/images/favicon.ico">


    <script type="text/javascript">
        //数量+1
        function pNum(gid, p, no) {
            var nums = $("#num_count" + no).val();
            $.ajax({
                url: "updateCartNum?gid=" + gid + "&num=1&price=" + p,
                method: "get",
                success: function () {
                    location.href = "getCart";
                },
                error: function () {
                    alert("服务器异常");
                }
            })
        }

        //数量-1  如果删除为0
        function mNum(gid, p, no) {
            var num = -1; //数量
            var nums = $("#num_count" + no).val();
            //验证是否需要删除
            if (Number(nums) <= 1) {
                if (confirm("确认要删除吗?")) {
                    /* num = 0; */
                    location.href = "clearCart?gid=" + gid;
                    return;
                } else {
                    return;
                }
            }
            //异步
            $.ajax({
                url: "updateCartNum?gid=" + gid + "&num=" + num + "&price=" + p,
                method: "get",
                success: function () {
                    location.href = "getCart";
                },
                error: function () {
                    alert("服务器异常");
                }
            })
        }

        function clearCart(gid) {
            if (confirm("确认要删除吗")) {
                location.href = "clearCart?gid=" + gid;
            }
        }
    </script>
</head>
<body>
<!-- 导航条start -->
<%@include file="header.jsp" %>
<!-- 导航条end -->

<!-- 标题 我的购物车-->
<div class="container">
    <div class="toptitle col-xs-12 col-md-12 col-sm-12 col-lg-12">
        <span class="line"></span>
        <p style="display: inline-block; font-size: 20px;">我的购物车 <small>温馨提示：产品是否购买成功，以最终下单为准哦，请尽快结算</small></p>
    </div>

    <div class="row" style="margin-top: 40px;">
        <div class="col-md-10 col-md-offset-1">
            <table class="table table-bordered table-striped table-hover">
                <tr>
                    <th>序号</th>
                    <th>商品名称</th>
                    <th>价格</th>
                    <th>数量</th>
                    <th>小计</th>
                    <th>操作</th>
                </tr>
                <c:set value="0" var="sum"></c:set>
                <c:forEach items="${carts}" var="c" varStatus="i">
                    <tr>
                        <th>${i.count}</th>
                        <th>${c.name}</th>
                        <th>${c.price}</th>
                        <th width="100px">
                            <div class="input-group">
		 						<span class="input-group-btn">
		 						<!--数量-1  -->
		 							<button class="btn btn-default" type="button"
                                            onclick="mNum(${c.gid},${c.price},${i.count})">-
		 							</button>
		 						</span>
                                <input type="text" class="form-control" id="num_count${i.count}" value="${c.num}"
                                       readonly="readonly" style="width:40px">
                                <span class="input-group-btn">
		 						<!-- 数量+1 -->
		 							<button class="btn btn-default" type="button"
                                            onclick="pNum(${c.gid},${c.price},${i.count})">+</button>
		 						</span>
                            </div>
                        </th>
                        <th>¥&nbsp;${c.money }元</th>
                        <th>
                            <button type="button" class="btn btn-default" onclick="clearCart(${c.gid})">删除</button>
                        </th>
                    </tr>
                    <c:set var="sum" value="${sum+c.money}"></c:set>
                </c:forEach>
            </table>
        </div>
    </div>
    <hr>
    <div class="row">
        <div class="pull-right" style="margin-right: 40px;">
            <div class="account">
                <a id="removeAllProduct" href="javascript:clearCart(0)" class="btn btn-default btn-lg">清空购物车</a>
                &nbsp;&nbsp;
                <a href="${pageContext.request.contextPath}/getOrderView" class="btn  btn-danger btn-lg">结算</a>
            </div>
            <br/>
            <br/>
            <div style="font-size: 20px">
                商品金额总计：<span id="total" class="text-danger"><b>￥&nbsp;&nbsp;${sum}元</b></span>
            </div>
        </div>
    </div>
</div>

<!-- 页脚start -->
<%@include file="footer.jsp" %>
<!-- 页脚end -->
</body>
<script>
    if (parseInt(${sum}) == 0) {
        $(".account>a").attr("disabled", true);
        $(".account>a").css("pointer-events", "none");
        $(".account>a").attr("href", "javascript:void(0);");
    }
</script>
</html>
